<template>
	<view class="realName_contant">
		<div class="card" style="margin-top: 0rpx;padding-bottom: 10rpx;">
			<view class="header">身份信息</view>
			<view class="cardab">
				<view class="card_top">请上传身份证人像面</view>
				<view class="card_bottom flex">
					<view class="bottom_left" @tap="uploadFilea">
						<view class="left_unlod flex" style="justify-content: center;" v-if="!carda">
							<text class="iconfont unload" style="font-size: 60rpx;color:#CDCCCF;"></text>
						</view>
						<u--image :src="carda" width="296rpx" height="192rpx" v-else></u--image>
					</view>
					<u--image src="https://jifugou.oss-cn-zhangjiakou.aliyuncs.com/01_default/carda.png" width="296rpx" height="192rpx"></u--image>
				</view>
				<view class="card_footer">请按照图示上传身份证头像面图片，并确保信息清晰</view>
			</view>
			<view class="cardab">
				<view class="card_top">请上传身份证国徽面</view>
				<view class="card_bottom flex">
					<view class="bottom_left" @tap="uploadFileb">
						<view class="left_unlod flex" style="justify-content: center;align-items: center;" v-if="!cardb">
							<text class="iconfont unload" style="font-size: 60rpx;color:#CDCCCF"></text>
						</view>
						<u--image :src="cardb" width="296rpx" height="192rpx" v-else></u--image>
						<!-- <image :src="cardb" mode="" v-else></image> -->
					</view>
					<u--image src="https://jifugou.oss-cn-zhangjiakou.aliyuncs.com/01_default/cardb.png" width="296rpx" height="192rpx"></u--image>
					<!-- <image class="card1" src="https://jifugou.oss-cn-zhangjiakou.aliyuncs.com/01_default/cardb.png" mode=""></image> -->
				</view>
				<view class="card_footer">请按照图示上传身份证国徽面图片，并确保信息清晰</view>
			</view>
			
		</div>
		<view class="sumbit" @tap="sumbit">确认提交</view>
		
	</view>
</template>

<script>
	import { utils } from '@/common/utils.js'
	import { RealName } from '@/common/http/api.js'
	export default {
		data() {
			return {
				carda:'',
				cardb:''
			}
		},
		methods: {
			// 图片上传
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: utils.baseUrl + 'api/v1/common/uploadFile', // 仅为示例，非真实的接口地址
						header:{"Authorization":uni.getStorageSync("userInfo").token},
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							if(JSON.parse(res.data).code== 401){
								this.$ut.msg('登录过期，请重新登录')
								setTimeout(()=>{
									uni.$u.route({
										url: 'pages_Me/login/login',
										type:'reLaunch'
									})
								},1000)
								return false;
							}
							resolve(JSON.parse(res.data))
						}
					});
				})
			},
			// 选择图片
			uploadFilea(){
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (res) => {
						var imgPath = res.tempFilePaths[0]
						this.uploadFilePromise(imgPath).then(res => {
							// this.avatar = res.data
							this.carda = res.data
						})
					}
				})
			},
			// 选择图片
			uploadFileb(){
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (res) => {
						var imgPath = res.tempFilePaths[0]
						this.uploadFilePromise(imgPath).then(res => {
							// this.avatar = res.data
							this.cardb = res.data
						})
						
					}
				})
			},
			// 提交
			sumbit(){
				if(!this.carda || !this.cardb){
					this.$ut.msg('请先上传')
					return false;
				}
				RealName({one:this.carda,two:this.cardb}).then(res => {
					this.$ut.msg('实名认证成功')
					uni.$u.route({type:'back'})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.realName_contant{
		.header{
			padding-bottom: 19rpx;
			border-bottom: 2rpx solid #F5F5F5;
			font-family: Alibaba PuHuiTi, Alibaba PuHuiTi;
			font-weight: 700;
			font-size: 31rpx;
			color: #666666;
			margin-bottom: 19rpx;
		}
		
		.cardab{
			.card_top{
				font-family: Alibaba PuHuiTi, Alibaba PuHuiTi;
				font-weight: 700;
				font-size: 29rpx;
				color: #313131;
				margin-bottom: 19rpx;
			}
			.card_bottom{
				justify-content: flex-start;
				.bottom_left{
					
					border-radius: 19rpx;
					margin-right: 105rpx;
					
					
					
					.left_unlod{
						width: 296rpx;
						height: 162rpx;
						background: #F5F4F7;
					}
				}
				image{
					width: 100%;
					height: 100%;
				}
			}
			.card_footer{
				font-size: 22rpx;
				color: #666666;
				margin: 19rpx 0;
			}
		}
		.sumbit{
			width: 75%;
			height: 74rpx;
			text-align: center;
			line-height: 74rpx;
			margin: 194rpx auto 40rpx;
			color:#fff;
			background: #FF4D60;
			border-radius: 42rpx;
		}
		
	}

</style>
